<template>
  <div class="side-bar">
    <div class="side-actions-container">
      <div class="side-actions-item" :class="[actionSelectedIndex == index ? 'selected' : null]" v-for="(item, index) in actions" :key="'side-actions-item-' + index" :title="item.tip" @click="actionItemClickHandle(item, index)">
        <i :class="item.icon"></i>
      </div>
    </div>
  </div>
</template>

<script>
import './content-side.less'

export default {
  name: 'ContentSide',
  data() {
    return {
      actions: [
        {
          icon: 'rd-iconfont rd-icon-project',
          tip: '资源管理器'
        },
        {
          icon: 'rd-iconfont rd-icon-search',
          tip: '搜索'
        }
      ],
      actionSelectedIndex: 0
    }
  },
  methods: {
    actionItemClickHandle(item, index) {
      this.actionSelectedIndex = index
    }
  }
}
</script>
